<?php
/**
 * 股票应用中心
 * @author liuzilu <fotomxq@gmail.com>
 * @version 1
 * @package stock
 */
//引用全局
require('glob.php');
//当前所属页面名称
$nowPageName = 'index';
?>

<!DOCTYPE html>
<html lang="zh-cn" dir="ltr">

    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>股票 - <?php echo $webData['WEB-TITLE']; ?></title>
        <link rel="shortcut icon" href="../assets/imgs/logo.ico" type="image/x-icon">
        <link rel="apple-touch-icon-precomposed" href="../assets/imgs/logo.png">
        <link rel="stylesheet" href="../assets/css/uikit.min.css">
        <link rel="stylesheet" href="../assets/css/components/notify.min.css">
        <link rel="stylesheet" href="assets/css/glob.css">
        <link rel="stylesheet" href="assets/css/index.css">
    </head>

    <body>

        <div class="uk-container uk-container-center uk-margin-top uk-margin-large-bottom">

        <?php require('page-menu.php'); ?>

            <div class="uk-grid" data-uk-grid-margin>
                <div class="uk-width-1-1">
                    <h2>持股</h2>
                    <p>当前持股的基本情况和个股的相关情况。</p>
                </div>
            </div>
            
            <hr>

            <div class="uk-grid" data-uk-grid-margin>
                <div class="uk-width-1-1">
                    <table class="uk-table uk-table-hover" id="stock-table">
                        <thead>
                            <tr>
                                <th>股票名称</th>
                                <th>成本价</th>
                                <th>成本金额</th>
                                <th>持股数</th>
                                <th>当前市值</th>
                                <th>现价</th>
                                <th>盈亏</th>
                                <th>止损价</th>
                                <th>止盈价</th>
                                <th>预警</th>
                                <th>操作</th>
                            </tr>
                        </thead>
                        <tfoot>
                            <tr>
                                <td><i class="uk-icon-cubes"></i> 合计</td>
                                <td>-</td>
                                <td>106000</td>
                                <td>6600</td>
                                <td>110688.00</td>
                                <td class="price-up">+22.3 (+2.35%)</td>
                                <td class="price-up">6697.11 (+5.9%)</td>
                                <td>-</td>
                                <td>-</td>
                                <td>-</td>
                                <td>-</td>
                            </tr>
                        </tfoot>
                        <tbody>
                            <tr>
                                <td>航天机电</td>
                                <td>11.56</td>
                                <td>47000</td>
                                <td>3900</td>
                                <td>49101.00</td>
                                <td class="price-up">+11.5 (+2.35%)</td>
                                <td class="price-up">4020.82 (+4.49%)</td>
                                <td>12.33 (-1.36%)</td>
                                <td>13.49 (+7.33%)</td>
                                <td>稳定</td>
                                <td>
                                    <a href="#inbox" class="uk-icon-hover uk-icon-inbox"></a>&nbsp;
                                    <a href="#deal" class="uk-icon-hover uk-icon-briefcase"></a>
                                </td>
                            </tr>
                            <tr>
                                <td>海通证券</td>
                                <td>21.82</td>
                                <td>59000</td>
                                <td>2700</td>
                                <td>61587.00</td>
                                <td class="price-up">+22.3 (+2.35%)</td>
                                <td class="price-up">2676.29 (+1.41%)</td>
                                <td>22.18 (-3.88%)</td>
                                <td>24.95 (+7.41%)</td>
                                <td>利好</td>
                                <td>
                                    <a href="#inbox" class="uk-icon-hover uk-icon-inbox"></a>&nbsp;
                                    <a href="#deal" class="uk-icon-hover uk-icon-briefcase"></a>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </div>
            </div>
            
            <hr>
            
            <div class="uk-grid" data-uk-grid-margin>
                <div class="uk-width-1-1">
                    <h2>收益统计</h2>
                    <canvas id="stockDChart" width="900" height="200"></canvas>
                </div>
            </div>

        </div>

        <script src="../assets/js/jquery.min.js"></script>
        <script src="../assets/js/uikit.min.js"></script>
        <script src="../assets/js/components/notify.min.js"></script>
        <script src="../assets/js/chart.min.js"></script>
        <script>
            $(function () {
                //日统计表设定
                $('#stockDChart').width($('#stockDChart').parent().width());
                var chartDdata = {
                    labels: ["1月", "2月", "3月", "4月", "5月", "6月", "7月", "8月", "9月", "10月", "11月", "12月"],
                    datasets: [
                        {
                            fillColor: "rgba(220,220,220,0.5)",
                            strokeColor: "rgba(220,220,220,1)",
                            pointColor: "rgba(220,220,220,1)",
                            pointStrokeColor: "#fff",
                            data: [65, 59, 22, 56, 55]
                        },
                        {
                            fillColor: "rgba(151,187,205,0.5)",
                            strokeColor: "rgba(151,187,205,1)",
                            pointColor: "rgba(151,187,205,1)",
                            pointStrokeColor: "#fff",
                            data: [28, 48, 40, 19, 21, 27]
                        }
                    ]
                }
                var chartDx = $("#stockDChart").get(0).getContext("2d");
                var stockDChart = new Chart(chartDx);
                new Chart(chartDx).Line(chartDdata, {
                    bezierCurve: false,
                    scaleShowLabels: true,
                    scaleLabel:'<%=value%>%'
                });
            });
        </script>

    </body>
</html>